import React from 'react';
import {DatePicker,Input,Button,Table, Modal,message} from 'antd';
import { PlusOutlined } from '@ant-design/icons';
import InnovationProjectController from '@/services/InnovationProject/InnovationProjectController';

const {RangePicker} = DatePicker;
const {TextArea} = Input;
const {confirm} = Modal
class NewProjectFive extends React.Component {
    constructor(props) {
        super(props);
        let storageData = JSON.parse(sessionStorage.getItem('newInnovationProject_five'))
        this.state = { 
            scheduleItems:storageData||[],
            userInfo:JSON.parse(sessionStorage.getItem("userInfo")),
            freshen:false,
            visibleModal:false
         };
    }
    componentDidMount(){
        this.props.onRef(this)
    }
    doFreshen=()=>{
        this.setState({freshen:!this.state.freshen})
    }
    dateChange=(dates,dateStrings)=>{
       let startDate=dateStrings[0]
       let endDate=dateStrings[1]
        this.setState({
            startDate,endDate
        })
    }
    addItem=()=>{
        const {scheduleItems,startDate,endDate,description}=this.state
        if(!startDate||!endDate){
            message.error('请选择进度开始与结束时间')
            return
        }
        if(!description){
            message.error('请输入进度安排')
            return
        }
        scheduleItems.push({startDate,endDate,description})
        this.setState({scheduleItems,visibleModal:false})
        this.doFreshen()

    }
    
    deleteItem=(text,rowData,index)=>{
        const {scheduleItems}=this.state
        scheduleItems.splice(index,1)
        this.setState({
            scheduleItems,
        })
        this.doFreshen()
    }
    handleChange=(e)=>{
        let description = e.target.value
        this.setState({
            description
        })
    }
    showModal=()=>{
        let {visibleModal}=this.state
        this.setState({visibleModal:!visibleModal})
    }
    saveDatas=()=>{
        let {scheduleItems}=this.state
        if(scheduleItems.length===0){
            message.error('至少输入一个进度安排')
            return;
        }
        sessionStorage.setItem('newInnovationProject_five',JSON.stringify(scheduleItems))
        return true

    }
    removeItem=()=>{
        sessionStorage.removeItem('newInnovationProject_one')
        sessionStorage.removeItem('newInnovationProject_two')
        sessionStorage.removeItem('newInnovationProject_three')
        sessionStorage.removeItem('newInnovationProject_four')
        sessionStorage.removeItem('newInnovationProject_five')
      }
      submit=()=>{
        let that = this
        if(this.saveDatas()){
        let params = this.setDatas()
          confirm({
            title:'提示',
            content:'确定要提交吗？',
            onOk(){
              InnovationProjectController.createdProject(params).then(r=>{
                if(r&&r.data===1){
                message.success('提交成功')
                }
                else{
                  message.error('提交失败，请稍后再试')
                }
                that.removeItem()
                that.props.onCancel()
              })
             
            }
          })          
        }
      }
 setDatas=()=>{
   let {userInfo,scheduleItems} = this.state
   let projectLevel=''
   if(userInfo.roleName.indexOf("省级")!==-1){
    projectLevel='省级'
}
if(userInfo.roleName.indexOf("市级")!==-1){
  projectLevel='市级'
}
   let newInnovationProject_one = JSON.parse(sessionStorage.getItem('newInnovationProject_one'))
   let newInnovationProject_two = JSON.parse(sessionStorage.getItem('newInnovationProject_two'))
   let newInnovationProject_three = sessionStorage.getItem('newInnovationProject_three')
   let newInnovationProject_four = sessionStorage.getItem('newInnovationProject_four')
   let budgetTotal = 0
   JSON.parse(sessionStorage.getItem('newInnovationProject_four')).forEach(element => {
    budgetTotal=budgetTotal+element.budget
   });
   let newInnovationProject_five = scheduleItems
   let datas = {
     ...newInnovationProject_one,
     ...newInnovationProject_two,
     projectLevel:projectLevel,
     filesItems:newInnovationProject_three,
     budgetItems:newInnovationProject_four,
     budgetTotal:budgetTotal,
     userName: userInfo.userName,
     scheduleItems:newInnovationProject_five
   }
   return datas
 }
    render() {
        const {scheduleItems,freshen,visibleModal} = this.state
        const columns=[
        {title:'序号',dataIndex:'index',render:(text,rowData,index)=><span>{index+1}</span>},
            {title:'开始时间',dataIndex:'startDate'},
            {title:'结束时间',dataIndex:'endDate'},
            {title:'描述',dataIndex:'description'},
            {title:'操作',dataIndex:'startDate',render:(text,rowData,index)=><a onClick={this.deleteItem.bind(this,text,rowData,index)}>删除</a>},
        ]

        return (
            <div>
                <Button type={'primary'} icon={<PlusOutlined/>} onClick={this.showModal}>增加</Button>
                {freshen&&<Table columns={columns} dataSource={scheduleItems} bordered/>}
                {!freshen&&<Table columns={columns} dataSource={scheduleItems} bordered/>}
                {visibleModal&&<Modal
                title={'添加'}
                visible={visibleModal}
                onCancel={()=>this.setState({visibleModal:false})}
                onOk={this.addItem}
                >
                <div>                                
                    <div><strong>进度安排：</strong></div>
                    <RangePicker onChange={this.dateChange}/>
                </div>
                    <strong style={{verticalAlign:'top'}}>工作内容：</strong>
                <span>
                    <TextArea onChange={this.handleChange} placeholder={'请输入'} style={{width:600}}/>
                </span>
                </Modal>}
            </div>
        );
    }
}

export default NewProjectFive;